<template >
  <div>
     <h1>vue3 的父子组件的v-model</h1>
     <h1>我是父组件</h1>
     <h1>父组件接受子组件的更新数据：{{message}}</h1>
     <h1>{{myname}}</h1>
     <hr>
     <!-- vue3 v-model:修饰符=“数据”
      快速完成父传子和子传父的方式 
      父组件通过v-model后的修饰符 传递给子组件 props定义的数据
      子组件通过emit("update:修饰符"，传值)触发事件并传给父组件值-->
     <cateOne v-model:name="myname" v-model:msg="message" ></cateOne>
     <hr>
    <h1>{{myage}}</h1>
    <!-- 用readonly创建的数据 无法修改 -->
    <button @click="myage++">加年龄</button>
  </div>
</template>

<script setup>

 import cateOne from './cateOne.vue'
 import {ref,readonly} from 'vue'
 let message=ref("10月1放假");
 let myname=ref("张三")

//  vue3的 readonly()方法  创建只读的数据 无法修改
let myage=readonly(28);
//  isRef()  检查某个值是否为 ref。 返回布尔值
let bl=isRef(myage); //false



</script>